<head>
    <jsp:directive.include file="/WEB-INF/jsp/prelude/include-head-meta.jspf"/>
    <title>登录注册页</title>
    <style>
        .from-item {
            font-size: 1.0rem;
            margin: 0.1875rem;
            width: 200px;
            height: 30px;
        }

        #btn {
            margin-left: 30px;
            width: 146px;
            height: 30px;
        }
    </style>

</head>
<body>


<div id="cc" class="easyui-layout" fit=true>
    <div data-options="region:'north',title:'用户注册',split:true" style="height:230px;">

        <form id="ff" method="post">
            <div class="from-item">
                <label for="name">昵称:</label>
                <input class="easyui-validatebox" type="text" name="userName" data-options="required:true">
            </div>
            <div class="from-item">
                <label for="name">手机:</label>
                <input class="easyui-validatebox" type="text" name="phone" data-options="required:true">
            </div>
            <div class="from-item">
                <label for="email">邮箱:</label>
                <input class="easyui-validatebox" type="text" name="email"
                       data-options="validType:'email',required:true">
            </div>
            <div class="from-item">
                <label for="password">密码:</label>
                <input class="easyui-validatebox" type="password" name="pwd" data-options="required:true">
            </div>
            <div class="from-item">
                <button id="btn" type="button" onclick="reg()" tyclass="easyui-linkbutton">注册提交</button>
            </div>
        </form>

    </div>
    <div data-options="region:'center',title:'用户列表'" style="padding:5px;background:#eee;">
        <table id="dg"></table>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $('#dg').datagrid({
            url: '/user/selectAll',
            fit: true,
            columns: [
                [{
                    field: 'id',
                    title: 'ID',
                    width: 100
                },
                    {
                        field: 'name',
                        title: '昵称',
                        width: 100
                    },
                    {
                        field: 'email',
                        title: '邮箱',
                        width: 100
                    },
                    {
                        field: 'password',
                        title: '密码',
                        width: 100,
                        align: 'right'
                    }
                ]
            ]
        });

    })

    function reg(){
        $('#ff').form('submit', {
            url: "/register/reg",
            success: function(data){
                if (data == "true") {
                    $.messager.alert('注册结果',"注册成功");
                } else {
                    $.messager.alert('注册结果',"注册失败");
                }
                $('#dg').datagrid('reload');
            }
        });
    }


</script>

</body>